describe('watch Data change', function() {
    var div1, d1, data1, data;
    beforeEach(function() {
        div1 = setFixtures("<div id='div1'></div>")
        d1 = {
            a: true,
            elems: [1, 2, 3]
        }
        data1 = {
            a: [{
                name: "George",
                url: "John",
                type: "Thomas"
            }, {
                name: "Geo",
                url: "Jo",
                type: "Thom"
            }]
        };





        $.ajax = mocka.mockView()
        jasmine.clock().install()

    })
    afterEach(function() {
        jasmine.clock().uninstall()
    })

    describe("watchIf", function() {
        it("should auto unbind the useless binded function", function() {
            jc.render(d1, "watchData_1", div1, function(th) {
                d1.a = false
                d1.a = true
                d1.elems.set(0, 3)
                expect(div1.find("li:first")).toBeVisible()
                expect(div1.find("li:first")).toContainText("3")
                expect(jc.$watchPB.fn.$jcQueue[th._data("id")]["elems.0"].length).toBe(1)

            })
        })
    })
    describe("watch Attr", function() {
        it("the attribute value of element can change as the data changes", function() {
            jc.render(d1, "watchData_2", div1, function(th) {
                expect(div1.find('#test1')).toHaveAttr("a", "" + d1.a)
                d1.a = "goes"
                expect(div1.find('#test1')).toHaveAttr("a", "" + d1.a)
            })
        })
        it("the attribute value of element can change when the data changes even the data is in an array", function() {
            jc.render(d1, "watchData_2", div1, function(th) {
                var lis = div1.find("li")
                d1.elems.forEach(function(elem, index) {
                    expect(lis.eq(index)).toHaveAttr("e", "" + elem)
                    d1.elems.set(index, elem + 3)
                    expect(lis.eq(index)).toHaveAttr("e", "" + (elem + 3))
                })
            })
        })
    })
    describe("jc-repeat shift data", function() {
        describe('jc-repeat tag', function() {
            beforeEach(function() {
                jc.render(data1, "jcRepeatSpec_1", div1, function() {
                    data = jc.th(div1).data();
                })
            })
            it("can repeat the form to template data", function() {
                var elems = data1.a;
                elems.shift();
                for (var i = 0; i < elems.length; i++) {
                    var li = div1.find("li:eq(" + i + ")");
                    expect(li.find("span[attr='name']")).toContainText(elems[i].name);
                    expect(li.find("span[attr='url']")).toContainText(elems[i].url);
                    expect(li.find("span[attr='type']")).toContainText(elems[i].type);
                    expect(li.find("span[attr='$index']")).toContainText(elems[i].$index);
                }


            })
        })
    })

});